import React, {Component} from 'react';
import {observer} from 'mobx-react';
import {Tools,Timeline} from 'weaver-mobile';
import classnames from 'classnames';
import Content from './Content';
const getLabel = Tools.getLabel;

@observer
export default class Item extends Component{
    render(){
        const {data, activeIndex, currIndex, isLast} = this.props;
        let label = (data.type === 'on' ? `${getLabel('125809','上班时间')} ` : `${getLabel('125810','下班时间')} `);
        label += (data.pre === '1' ? getLabel('500501','昨日') : (data.across === '1' ? getLabel('388785','次日') : ''));
        label += data.time;
        const infoClassName = classnames({
            info: true,
            ['info-last']: isLast
        })

        const className = classnames({
            dot: true,
            ['dot-active']: data.active === '1',
            ['dot-default']: data.active === '0'
        });
        let dot = (data.type === 'on' ? '上' : '下');
        return (
            <div className={infoClassName}>
                <div className='schedual'>
                    <Timeline.Item dot={<div className={className}><div >{dot}</div></div>}>
                         <Content {...this.props} label={label}/>
                    </Timeline.Item>
                </div>
            </div>
        )
        /*return (
            <div className={infoClassName}>
                <div className='schedual'>
                    <div className={className}><div >{dot}</div></div>
                    <div className='time'>{label}</div>
                </div>
                <Content {...this.props}/>
            </div>
        )*/
    }
}